<template>
  <view class="details-btn-box">
    <view :class=" btn1 ? 'details-btn': 'details-btn btn-disable'" @click="toIntroduce">MBTI简介</view>
    <view :class=" btn2 ? 'details-btn': 'details-btn btn-disable'" @click="toDimension" :disabled="btn2">八维简介</view>
    <view :class=" btn3 ? 'details-btn': 'details-btn btn-disable'" @click="toResult" :disabled="btn3">我的人格</view>
  </view>
</template>

<script>

export default {
  name: 'DetailsBtnBox',
  data() {
    return {
      btn1: true,
      btn2: true,
      btn3: true
    }
  },
  onLoad() {

  },
  mounted () {
    this.checkPath()
  },
  methods: {
    toIntroduce() {
      var pages = getCurrentPages();
      var page = (pages[pages.length - 1]).route;


      if(page === 'pages/introduce/index') return

      uni.navigateTo({
        url: "../../pages/introduce/index"
      })
    },
    toDimension() {
      var pages = getCurrentPages();
      var page = (pages[pages.length - 1]).route;

      if(page === 'pages/dimension/index') return

      uni.navigateTo({
        url: "../../pages/dimension/index"
      })
    },
    toResult() {
      var pages = getCurrentPages();
      var page = (pages[pages.length - 1]).route;

      if(page === 'pages/result/index') return
      uni.navigateTo({
        url: "../../pages/result/index"
      })
    },
    checkPath() {
      let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
      let curRoute = routes[routes.length - 1].route //获取当前页面路由
      console.log(curRoute)

      if(curRoute === 'pages/introduce/index') {
        this.btn1 = false
      }
      else if(curRoute === 'pages/dimension/index') {
        this.btn2 = false
      }
      else if(curRoute === 'pages/result/index') {
        this.btn3 = false
      }
    }
  }
}
</script>

<style lang="scss" scoped>
  .details-btn-box {
    display: flex;
    justify-content: space-between;
    align-items: center;

    .details-btn {
      width: 180rpx;
      height: 64rpx;
      background:linear-gradient(315deg,rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.2) 100%);
      border-radius:5px;
      font-size: 26rpx;
      color:rgba(255,255,255,1);
      text-align: center;
      line-height: 64rpx;
    }

    .btn-disable {
      background:gray;
    }
  }
</style>
